<template>
    <div class="home">
        <div v-for="(item,index) in noteList" :key="index" class="note_list">
            <div class="title">{{ item.note_title }}</div>
            <img :src="item.note_img" alt="">
            <div class="cont">{{ item.note_text }}</div>
        </div>
    </div>
</template>
<script setup>
import { ref } from "vue";
import { showToast } from "vant";
import { storeToRefs } from 'pinia'
import { myNoteStore } from '@/stores/note.js'
import { onMounted } from 'vue' 
import { useRouter } from 'vue-router'
// 实例化仓库
const router = useRouter()
const noteStore = myNoteStore()
// 解构
const { shareNoteList } = noteStore
const { noteList } = storeToRefs(noteStore)
onMounted(async()=>{
  try {
    await shareNoteList(1)
  } catch (error) {
    return Promise.reject(error)
  }
})
</script>
<style lang="less" scoped>
.note_list {
  margin:5px;
  margin-top: 5px;
  box-shadow: 0px 3px 10px 0px rgba(0,0,0,0.1);
  padding: 4px;
  .title {
    font-weight: 600;
    font-size: 18px;
    color: black;
    margin-bottom: 5px;
  }
}
</style>